<template>
  <div class='container'>
    <div class='app-row m-20-t'>
      <span class="title bold width-100 align-right">品牌名称:</span>
      <el-input class='flex-1' v-model="name_value"></el-input>
    </div>
    <div class='app-row m-20-t'>
      <span class="title bold width-100 align-right">排序:</span>
      <el-input class='flex-1' v-model="rank_value"></el-input>
    </div>
    <div class='app-row m-20-t'>
      <span class="title bold width-100 align-right">品牌链接:</span>
      <el-input class='flex-1' v-model="url_value"></el-input>
    </div>
    <div class='annotation m-10-t m-114-l' >
      <span>完整的URL链接地址，如：http://www.aircheng.com</span>
    </div>
    <div class="app-row m-30-t">
      <span class="title bold width-100 align-right">展示图片:</span>
      <el-upload
        class="upload-demo"
        action="https://jsonplaceholder.typicode.com/posts/"
        multiple>
        <el-button size="small" type="primary">点击上传</el-button>
        <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
      </el-upload>
    </div>
    <div class='app-row m-50-t'>
      <span class="title bold width-100 align-right">品牌描述:</span>
      <el-input type='textarea' :rows="8" class='flex-1' v-model="description_value"></el-input>
    </div>
    <div class="app-row j-c-c m-100-t">
      <el-button type="success" @click="edit_button">确认修改</el-button>
    </div>
  </div>
</template>

<script>
  import brand_request from "@/api/brand_request"
  export default {
    name: 'brand_edit',
    data() {
      return {
        name_value: "",
        description_value: "",
        url_value: "",
        rank_value: '',
      }
    },
    created() {
      this.get_detail(this.$route.query.id)
    },
    mounted() {
  
    },
    methods: {
      edit_button() {
        let params = {
          id: this.$route.query.id,
          name: this.name_value
        }
        brand_request.edit_brand(params, res=> {
          this.$router.push('/academic/brand')
        })
      },
      get_detail(id) {
        brand_request.detail_brand({id}, res=> {
          console.log(res);
          let result = res.data
          this.name_value = result.name 
        })
      }
    }
  }
</script>

<style scoped>
@import "~@/styles/layout.scss";
</style>